<template>
    {{#if ctrl.psSysPFPlugin}}
    {{> @macro/plugins/widget/widget-use.hbs appPlugin=ctrl.psSysPFPlugin}}
    {{else}}
    <AppMultiEditViewPanel
        :id="controlID"
        :items="store.data"
        :class="classNames"
        {{#or ctrl.width ctrl.height}}
        style="{{#if ctrl.width}}width: {{ctrl.width}}px;{{/if}}{{#if ctrl.height}}width: {{ctrl.height}}px;{{/if}}"
        {{/or}}
        :panelStyle="panelStyle"
        :viewName="embedView.embedViewName"
        @add="handleAdd"
        @remove="handleRemove">
        {{#if ctrl.embeddedPSAppView}}
        <template #default="{ context, viewParams, itemId }">
            <{{ctrl.embeddedPSAppView.codeName}}
                :context="context"
                :viewParams="viewParams"
                openType="EMBED"
                class="view-container2"
                @view-init="(name: string, data: IViewAbility) => { handleCtrlInit(controller, name+itemId, data); }"
                @view-action="(name: string, action: string, data: IParam[]) => { handleCtrlAction(controller, name+itemId, action, data); }"
                @view-mounted="(name: string, data: IParam) => { handleCtrlMounted(controller, name+itemId, data); }">
            </{{ctrl.embeddedPSAppView.codeName}}>
        </template>
        {{/if}}
    </AppMultiEditViewPanel>
    {{/if}}
</template>
<script setup lang="ts">
// 基于template/src/widgets/\{{appEntities}}/\{{ctrls@MULTIEDITVIEWPANEL}}-multi-editview-panel/\{{spinalCase ctrl.codeName}}-multi-editview-panel.vue.hbs生成
{{> @macro/plugins/widget/widget-import.hbs ctrl=ctrl}}
import { model } from './{{spinalCase ctrl.codeName}}-multi-editview-panel-model';
import { AppMultiEditViewPanel } from '@components/widgets/multi-editview-panel';
import { {{pascalCase ctrl.name }}ControlVO } from './{{spinalCase ctrl.codeName}}-multi-editview-panel-vo';
import { MultiEditViewPanelActionType, MultiEditViewPanelController, IContext, IMultiEditViewPanelAbility, IMultiEditViewPanelControllerParams, IMultiEditViewPanelStore, IParam, ICtrlDataAction, IMultiEditViewPanelController, ILoadingHelper, createUUID, IViewCtx, IViewAbility } from '@/core';
import { useNavParamsBind, useEventBind, getCtrlClassNames, handleCtrlInit, handleCtrlAction, handleCtrlMounted } from '@/hooks/use-ctrl';
import MultiEditViewPanelService from "@/core/modules/ctrl-service/multi-edit-view-panel-service";
{{#if ctrl.embeddedPSAppView}}
import {{ctrl.embeddedPSAppView.codeName}} from '@views/{{#if ctrl.embeddedPSAppView.psAppModule.codeName}}{{spinalCase ctrl.embeddedPSAppView.psAppModule.codeName}}/{{/if}}{{spinalCase ctrl.embeddedPSAppView.codeName}}/{{spinalCase ctrl.embeddedPSAppView.codeName}}.vue';
{{/if}}
{{> @macro/widgets/ctrl/ctrl-props.hbs
    props="openView?: Function;
    newView?: Function;
    actions: ICtrlDataAction;
    panelStyle: 'ROW' | 'TAB_TOP';
    embedView: IParam;
    "
    propsDefault="panelStyle: 'ROW',"
}}

{{> @macro/common/emit.hbs name="ctrl" actionType="MultiEditViewPanelActionType" ability="IMultiEditViewPanelAbility"}}

const controlID = createUUID();

const classNames = computed(() => {
  return getCtrlClassNames(model, props);
});

const ctrlService = new MultiEditViewPanelService<{{pascalCase ctrl.name}}ControlVO>({{pascalCase ctrl.name}}ControlVO, model.entityCodeName);

const params: IMultiEditViewPanelControllerParams<MultiEditViewPanelActionType, IMultiEditViewPanelAbility> = {
    name: props.name,
    model,
    evt,
    controlID,
    embedView: props.embedView,
    pLoadingHelper: props.pLoadingHelper,
    actions: props.actions,
    openView: props.openView,
    newView: props.newView,
    closeView: props.closeView,
    ctrlService: ctrlService,
    pViewCtx: props.pViewCtx,
    handler: (data: IMultiEditViewPanelStore) => { return reactive(data) }
};
{{> @macro/common/controller.hbs name="ctrl" IController="IMultiEditViewPanelController" store="IMultiEditViewPanelStore" ability="IMultiEditViewPanelAbility" controller="MultiEditViewPanelController"}}

const handleAdd = (event: MouseEvent) => {
    controller.handleAdd();
}

const handleRemove = (item: IParam) => {
    controller.handleRemove(item);
}

</script>